<template>
  <div>
    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <!-- <van-cell v-for="(item, index) in list" :key="index" :title="item" /> -->

      <comment-item
        v-for="(item, index) in list"
        :key="index"
        :comment="item"
        @replycomment="$emit('replycomment' , $event)"
      ></comment-item>
     
    </van-list>
  </div>
</template>

<script>
import { commentsGet } from "@/api/articles";

import commentItem from "./comment-item";
export default {
  components: {
    commentItem,
  },

  // props: ["target", "list"],
  props : {
    target : {
      type : [Number, String, Object]
    },
    list : {
      type : Array
    },
    type : {
      validator(value){
        return ['a','c'].includes(value)
      },
      default : 'a'
    }
  },
  data() {
    return {
      loading: false,
      finished: false,
    };
  },
  methods: {
    onLoad() {
      this.getComments();
    },

    // 获取文章评论
    async getComments() {
      const { data: res } = await commentsGet({
        type: this.type,
        source: this.target.toString(),
        offset: this.offset,
        limit: 10,
      });
      console.log(res, 3333);

      this.list.push(...res.data.results);
      console.log(this.list);
      if (res.data.results.length) {
        this.offset = res.data.last_id;
      }
      {
        this.finished = true;
      }
    },
  },
  created() {
    this.loading = true;
    this.onLoad();
  },
};
</script>

<style>
</style>